import { Component, OnInit } from '@angular/core';
import { SheetParams, SheetService } from '@services/sheet.service';
import { ActivatedRoute, Router } from '@angular/router';
import { SheetList } from '@services/data-types/common.type';
import { BatchActionsService } from '@store/batch-actions.service';

@Component({
  selector: 'app-sheet-list',
  templateUrl: './sheet-list.component.html',
  styleUrls: ['./sheet-list.component.less']
})
export class SheetListComponent implements OnInit {
  sheetParams: SheetParams = {
    offset: 1,
    limit: 35,
    order: 'hot',
    cat: '全部'
  };
  sheetList: SheetList;
  orderValue = 'hot';
  constructor(
    private router: Router,
    private sheetService: SheetService,
    private batchActionsService: BatchActionsService,
    private route: ActivatedRoute
  ) { }
  ngOnInit() {
    this.getSheetList();
  }
  getSheetList() {
    this.sheetParams.cat = this.route.snapshot.queryParamMap.get('cat') || '全部';
    this.sheetService.getSongSheet(this.sheetParams).subscribe(res => {
      this.sheetList = res;
    });
  }
  onOrderValueChange(order: 'new' | 'hot') {
    this.sheetParams.order = order;
    this.sheetParams.offset = 1;
    this.getSheetList();
  }
  onPageChange(pageNum: number) {
    this.sheetParams.offset = pageNum;
    this.getSheetList();
  }
  playSongSheet(id: number) {
    this.sheetService.playSongSheet(id).subscribe(list => {
      this.batchActionsService.selectPlayList({ list, index: 0 });
    });
  }
  skipToSheetInfo(id: number): void {
    this.router.navigate(['/sheetInfo', id]).then();
  }
}
